<template>
  <div :class="$style.board">
    <el-dialog
      v-model="open"
      fullscreen
      :before-close="backStorage"
      class="pdDialog"
    >
      <el-row :gutter="40">
        <el-col :span="12">
          <iframe
            id="ifrPdf"
            :src="pdfSrc"
            frameborder="0"
            style="width: 100%; height: 730px"
          ></iframe>
        </el-col>
        <el-col :span="12">
          <table style="width: 100%; line-height: 0px">
            <!-- logo -->
            <tr>
              <td style="width: 40%">
                <img
                  src="@/assets/images/favorite2.png"
                  style="height: 24px"
                  mode="aspectFit"
                />
              </td>
              <td style="">
                <h3
                  style="
                    letter-spacing: 2px;
                    font-size: 16px;
                    font-weight: bold;
                  "
                >
                  COLMO高端线首件确认表
                </h3>
              </td>
            </tr>
          </table>

          <table class="table-border" style="text-align: center">
            <colgroup>
              <col style="width: 50px" />
              <col style="width: 120px" />
              <col style="width: 150px" />
              <col style="width: auto" />
              <col style="width: 100px" />
              <col style="width: 80px" />
            </colgroup>
            <tr>
              <td colspan="3"><p>产品名称</p></td>
              <td><p>产品编号</p></td>
              <td colspan="2"><p>生产设备编号</p></td>
            </tr>
            <tr>
              <td colspan="3">
                <p>{{ firstPieceData.itmWlpm }}</p>
              </td>
              <td>
                <p>{{ firstPieceData.itmCustwldm }}</p>
              </td>
              <td colspan="2">
                <p>{{ firstPieceData.gsjlJtbh }}</p>
              </td>
            </tr>
            <tr style="letter-spacing: 2px">
              <td colspan="3"><p>报检日期</p></td>
              <td>
                <p>数量</p>
              </td>
              <td colspan="2"><p>报检人</p></td>
            </tr>
            <tr>
              <td colspan="3">
                <p>{{ $moment(firstPieceData.gsjlKssj).format() }}</p>
              </td>
              <td>
                <p>{{ firstPieceData.gsjlNum }}</p>
              </td>
              <td colspan="2">
                <p>{{ firstPieceData.gsjlJlry }}</p>
              </td>
            </tr>
            <tr style="background-color: #ccc">
              <td><p>序号</p></td>
              <td><p>检验项目</p></td>
              <td colspan="2"><p>标准要求</p></td>
              <td><p>实测</p></td>
              <td><p>判定</p></td>
            </tr>
            <tr>
              <td><p>1</p></td>
              <td><p>外观</p></td>
              <td colspan="2" class="align-left">
                <p>
                  1、白色产品表面不允许有顶自、流痕、划痕、料花、毛刺、黑点浇口丝等缺陷，2、进胶口、毛边修理平整，修边良好不得有波浪纷现象，符合封样或图纸等技术要求，3、产品表面不得有油污，生产过程中不得使用脱模剂:4、产品不得成型不良，裂纹等严重不良现象，5、缩印、变形按样品控制。
                </p>
              </td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-select
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlExterior"
                  >
                    <el-option
                      v-for="dict of listTest"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                      :key="dict.dictValue"
                    ></el-option>
                  </el-select>
                  <template #read>
                    <dict-tag
                      :options="listTest"
                      :value="firstPieceData.gsjlExterior"
                    />
                  </template>
                </HdFormItem>
              </td>
              <td>
                <dict-tag
                  :options="listJudg"
                  :value="firstPieceData.gsjlExterior"
                />
              </td>
            </tr>
            <tr>
              <td rowspan="4"><p>2</p></td>
              <td rowspan="4"><p>结构要点</p></td>
              <td class="align-left"><p>组件尺寸</p></td>
              <td>
                <p>
                  {{ firstPieceData.itmJccc1 }}（{{
                    firstPieceData.itmJccc1X + "~" + firstPieceData.itmJccc1S
                  }}）
                </p>
              </td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-input
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlZjccv"
                  />
                </HdFormItem>
              </td>
              <td>
                <dict-tag
                  :options="listJudg"
                  :value="firstPieceData.gsjlZjcc"
                />
              </td>
            </tr>
            <tr>
              <td class="align-left"><p>海绵长度</p></td>
              <td class="align-left"><p>反面红线要求长度要规范。</p></td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-select
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlHmcd"
                  >
                    <el-option
                      v-for="dict of listTest"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                      :key="dict.dictValue"
                    ></el-option>
                  </el-select>
                  <template #read>
                    <dict-tag
                      :options="listTest"
                      :value="firstPieceData.gsjlHmcd"
                    />
                  </template>
                </HdFormItem>
              </td>
              <td>
                <dict-tag
                  :options="listJudg"
                  :value="firstPieceData.gsjlHmcd"
                />
              </td>
            </tr>
            <tr>
              <td class="align-left"><p>形状海统</p></td>
              <td class="align-left">
                <p>正面风道的形状海绵不可漏贴，起皱</p>
              </td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-select
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlXzht"
                  >
                    <el-option
                      v-for="dict of listTest"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                      :key="dict.dictValue"
                    ></el-option>
                  </el-select>
                  <template #read>
                    <dict-tag
                      :options="listTest"
                      :value="firstPieceData.gsjlXzht"
                    />
                  </template>
                </HdFormItem>
              </td>
              <td>
                <dict-tag
                  :options="listJudg"
                  :value="firstPieceData.gsjlXzht"
                />
              </td>
            </tr>
            <tr>
              <td class="align-left"><p>装饰件装配</p></td>
              <td class="align-left">
                <p>装饰件宽边在风道反面与防呆卡位对准</p>
              </td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-select
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlZsjzp"
                  >
                    <el-option
                      v-for="dict of listTest"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                      :key="dict.dictValue"
                    ></el-option>
                  </el-select>
                  <template #read>
                    <dict-tag
                      :options="listTest"
                      :value="firstPieceData.gsjlZsjzp"
                    />
                  </template>
                </HdFormItem>
              </td>
              <td>
                <dict-tag
                  :options="listJudg"
                  :value="firstPieceData.gsjlZsjzp"
                />
              </td>
            </tr>
            <tr>
              <td><p>3</p></td>
              <td><p>色差光泽度</p></td>
              <td colspan="2" class="align-left">
                <p>与标准色板确认色差AE≤0.8，光泽度要符合标准管控要求。</p>
              </td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-input
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlScgzdv"
                  />
                </HdFormItem>
              </td>
              <td>
                <dict-tag
                  :options="listJudg"
                  :value="firstPieceData.gsjlScgzd"
                />
              </td>
            </tr>
            <tr>
              <td rowspan="5"><p>4</p></td>
              <td rowspan="5"><p>配合</p></td>
              <td class="align-left"><p>间隙</p></td>
              <td class="align-left"><p>组件直线度≤3mm</p></td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-input
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlJxv"
                  />
                </HdFormItem>
              </td>
              <td>
                <dict-tag :options="listJudg" :value="firstPieceData.gsjlJx" />
              </td>
            </tr>
            <tr>
              <td class="align-left"><p>平面直线度(F)</p></td>
              <td class="align-left"><p>平面直线度≤3mm</p></td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-input
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlPmzxdv"
                  />
                </HdFormItem>
              </td>
              <td>
                <dict-tag
                  :options="listJudg"
                  :value="firstPieceData.gsjlPmzxd"
                />
              </td>
            </tr>
            <tr>
              <td class="align-left"><p>组装</p></td>
              <td class="align-left">
                <p>组件装配间隙均匀，间隙差符合设计间隙≤5mm</p>
              </td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-input
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlPhZzv"
                  />
                </HdFormItem>
              </td>
              <td>
                <dict-tag
                  :options="listJudg"
                  :value="firstPieceData.gsjlPhZz"
                />
              </td>
            </tr>
            <tr>
              <td class="align-left"><p>导线和端子</p></td>
              <td class="align-left">
                <p>
                  导线和端子的规格和型号符合技术列表要求，导线保护层无破损、变色，端子连接正确可靠。
                </p>
              </td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-select
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlDxhdz"
                  >
                    <el-option
                      v-for="dict of listTest"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                      :key="dict.dictValue"
                    ></el-option>
                  </el-select>
                  <template #read>
                    <dict-tag
                      :options="listTest"
                      :value="firstPieceData.gsjlDxhdz"
                    />
                  </template>
                </HdFormItem>
              </td>
              <td>
                <dict-tag
                  :options="listJudg"
                  :value="firstPieceData.gsjlDxhdz"
                />
              </td>
            </tr>
            <tr>
              <td class="align-left"><p>装配</p></td>
              <td class="align-left">
                <p>装配应连接牢固，无松脱晃动、卡扣断裂等现象。</p>
              </td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-select
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlZp"
                  >
                    <el-option
                      v-for="dict of listTest"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                      :key="dict.dictValue"
                    ></el-option>
                  </el-select>
                  <template #read>
                    <dict-tag
                      :options="listTest"
                      :value="firstPieceData.gsjlZp"
                    />
                  </template>
                </HdFormItem>
              </td>
              <td>
                <dict-tag :options="listJudg" :value="firstPieceData.gsjlZp" />
              </td>
            </tr>
            <tr>
              <td><p>5</p></td>
              <td><p>结构</p></td>
              <td colspan="2" class="align-left">
                <p>比对样品、不可影响装配，确认形状海绵贴粘贴到位、不可漏贴</p>
              </td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-select
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlJg"
                  >
                    <el-option
                      v-for="dict of listTest2"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                      :key="dict.dictValue"
                    ></el-option>
                  </el-select>
                  <template #read>
                    <dict-tag
                      :options="listTest2"
                      :value="firstPieceData.gsjlJg"
                    />
                  </template>
                </HdFormItem>
              </td>
              <td>
                <dict-tag :options="listJudg" :value="firstPieceData.gsjlJg" />
              </td>
            </tr>
            <tr>
              <td><p>6</p></td>
              <td><p>组装</p></td>
              <td colspan="2" class="align-left">
                <p>泡沫密封及玻璃压合不可存在段差</p>
              </td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-select
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlZz"
                  >
                    <el-option
                      v-for="dict of listTest2"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                      :key="dict.dictValue"
                    ></el-option>
                  </el-select>
                  <template #read>
                    <dict-tag
                      :options="listTest2"
                      :value="firstPieceData.gsjlZz"
                    />
                  </template>
                </HdFormItem>
              </td>
              <td>
                <dict-tag :options="listJudg" :value="firstPieceData.gsjlZz" />
              </td>
            </tr>
            <tr>
              <td><p>7</p></td>
              <td><p>包装</p></td>
              <td colspan="2" class="align-left">
                <p>核对标签，产品名称，物料编码要与实物一致。</p>
              </td>
              <td>
                <HdFormItem :readOnly="readOnly">
                  <el-select
                    size="mini"
                    placeholder=""
                    v-model="firstPieceData.gsjlBz"
                  >
                    <el-option
                      v-for="dict of listTest2"
                      :label="dict.dictLabel"
                      :value="dict.dictValue"
                      :key="dict.dictValue"
                    ></el-option>
                  </el-select>
                  <template #read>
                    <dict-tag
                      :options="listTest2"
                      :value="firstPieceData.gsjlBz"
                    />
                  </template>
                </HdFormItem>
              </td>
              <td>
                <dict-tag :options="listJudg" :value="firstPieceData.gsjlBz" />
              </td>
            </tr>
            <tr>
              <td colspan="6">
                <table style="width: 100%" class="noborder">
                  <tr>
                    <td
                      style="
                        vertical-align: text-top;
                        background: #ccc;
                        text-indent: 6px;
                      "
                      align="left"
                    >
                      检验结果：
                      <p style="text-align: center">
                        <HdFormItem :readOnly="readOnly">
                          <el-select
                            v-model="firstPieceData.gsjlPdjg"
                            placeholder="请选择"
                          >
                            <el-option
                              v-for="item in resultList"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value"
                            ></el-option>
                          </el-select>
                          <template #read>
                            <dict-tag
                              :options="resultList"
                              :value="firstPieceData.gsjlPdjg"
                            />
                          </template>
                        </HdFormItem>
                      </p>
                      <p style="text-align: right; margin-right: 5rem">
                        质检员 (签名):{{ firstPieceData.gsjlQrry }}
                      </p>
                    </td>
                  </tr>
                  <tr>
                    <td
                      style="
                        border-top: 1px solid #000;
                        vertical-align: text-top;
                        text-indent: 6px;
                      "
                      align="left"
                    >
                      处理意见：
                      <p style="text-align: center">
                        {{ firstPieceData.gsjlFpdesc }}
                      </p>
                      <p style="text-align: right; margin-right: 5rem">
                        复核人员 (签名):{{ firstPieceData.gsjlChkry }}
                      </p>
                    </td>
                  </tr>
                  <tr>
                    <td
                      style="
                        border-top: 1px solid #000;
                        vertical-align: text-top;
                        background: #ccc;
                        text-indent: 6px;
                      "
                      align="left"
                    >
                      审核结果：
                      <p style="text-align: center">
                        <DictTag
                          :value="2"
                          keyName="first_part_state"
                          type="text"
                        ></DictTag>
                      </p>
                      <p style="text-align: right; margin-right: 5rem">
                        审核人 (签名):{{ firstPieceData.gsjlAuditPeople }}
                      </p>
                    </td>
                  </tr>
                  <tr>
                    <td style="border-top: 1px solid #000">
                      <div>
                        <div style="float: left; text-indent: 6px">说明：</div>
                        <div
                          style="float: left; letter-spacing: 2px"
                          class="align-left"
                        >
                          <p>■检验结果仅对本次样品负责。</p>
                          <p>■代首件样品确认后，方可转入批量生产。</p>
                          <p>
                            ■质检员判定不合格（×）的项目，班长必须及时安排改进，解决合格后方可生产。
                          </p>
                          <p>■若有特殊重大问题，及时通知生产主任。</p>
                          <p>
                            ■若实物符合检查要求，由质检人员在“实际情况栏目”种打√。
                          </p>
                        </div>
                      </div>
                    </td>
                  </tr>
                </table>
              </td>
            </tr>
          </table>
        </el-col>
      </el-row>

      <div slot="footer"></div>
    </el-dialog>
  </div>
</template>

<script>
import {
  getJybzPath,
  listFirstPartConfirmationDeatilG,
  getConfirmBaseViewByJtbh,
} from "@/api/quality/firstPart";

export default {
  name: "board_ColmoJudg",
  data() {
    return {
      open: true,
      order_info: {},
      pdfSrc: "",
      firstPieceData: {},
      readOnly: true,
      // 实测
      listTest: [
        { dictValue: "OK", dictLabel: "无异常" },
        { dictValue: "-", dictLabel: "不适用" },
        { dictValue: "NG", dictLabel: "不合格" },
      ],
      listTest2: [
        { dictValue: "OK", dictLabel: "符合" },
        { dictValue: "-", dictLabel: "不适用" },
        { dictValue: "NG", dictLabel: "不符合" },
      ],
      // 判定
      listJudg: [
        { dictValue: "OK", dictLabel: "√" },
        { dictValue: "-", dictLabel: " " },
        { dictValue: "NG", dictLabel: "X" },
      ],
      // 判定结果列表
      resultList: [
        { dictValue: "OK", dictLabel: "合格" },
        { dictValue: "NG", dictLabel: "不合格" },
      ],
    };
  },
  destroyed() {
    this.clearIntvers();
  },
  mounted() {
    this.getList();
    this.creatIntvers();
  },

  methods: {
    creatIntvers() {
      this.clearIntvers();
      this.intver1 = setInterval(() => {
        this.getList();
      }, 60000);
    },
    clearIntvers() {
      if (this.intver1) clearInterval(this.intver1);
    },
    getList() {
      //this.open_file_jybz()
      getConfirmBaseViewByJtbh("G高端线A").then((res) => {
        this.firstPieceData = res.data;
        this.pdfSrc =
          process.env.VUE_APP_BASE_API +
          this.firstPieceData.docPath.replace(/\\/g, "/");
      });
    },
    open_file_jybz() {
      this.pdfSrc = "about:blank";
      getJybzPath("J.MB.1.03.00.416").then(this.showPdf);
    },
    showPdf(res) {
      if (res.msg && res.msg.indexOf("profile") > 0) {
        // this.openFile(res.msg.replace(/\\/g, '/'));
        this.pdfSrc =
          process.env.VUE_APP_BASE_API + res.msg.replace(/\\/g, "/");
        this.showPreview = true;
      } else {
        // if (res.msg) uni.$u.toast(res.msg)
        // else uni.$u.toast('未上传相应文件')
      }
    },
    backStorage() {
      this.open = false;
      // 返回上级路由并关闭当前路由
      this.$store.state.tagsView.visitedViews.splice(
        this.$store.state.tagsView.visitedViews.findIndex(
          (item) => item.path === this.$route.path
        ),
        1
      );
      this.$router.push({ path: "/index" });
    },
  },
  beforeRouteEnter(to, from, next) {
    next((vm) => {
      vm.open = true;
      vm.creatIntvers();
      // 通过 `vm` 访问组件实例
    });
  },
  beforeRouteLeave(to, from, next) {
    this.clearIntvers();
    next();
  },
};
</script>

<style lang="scss" module>
@import "./board.scss";
.board {
  :global {
    .el-dialog__wrapper .el-dialog {
      background-color: ghostwhite;
      .el-dialog__header {
        height: 20px;
        padding: 0px;
      }
    }
    .el-tag--medium {
      color: #000;
      font-size: 14px;
      line-height: 15px;
      height: 15px;
    }
  }
  :global(.pdDialog .table-border) {
    line-height: 14px;
    font-size: 12px;
  }
}
</style>
